<!-- src/views/CounterDemoView.vue -->
<template>
  <div>
    <h1>组合式函数演示：useCounter</h1>
    <CounterDisplay :count="count" :double="double" />
    <div>
      <button @click="increment">+1</button>
      <button @click="decrement">-1</button>
      <button @click="reset">重置</button>
    </div>
  </div>
</template>

<script setup>
import { useCounter } from '@/composables/useCounter.js'
import CounterDisplay from '@/components/CounterDisplay.vue'

// 使用组合式函数
const { count, double, increment, decrement, reset } = useCounter(10)
</script>
